import { CommonFunction } from "./CommonFunction";
import { EventDefinition } from "./EventDefinition";
import { ListenerCenter } from "./ListenerCenter";
import { GlobalDefinition } from "./GlobalDefinition";
import { AttributeClass } from "./AttributeClass";

/**文件处理类 */
export class FileDisposClass {
    private CF: CommonFunction;
    private CurrentData: FileData[] = [];
    private startIndexEle:HTMLInputElement;
    private Index:number = 0;  //图片顺序标记索引

    public constructor() {
        this.CF = CommonFunction.ins();
        this.startIndexEle = this.CF.IdToElement("setBlockStartIndex") as HTMLInputElement;
        this.Index = parseInt(this.startIndexEle.value);
    }

    /**绑定文件拖放的标签 
     * @param ele: 要绑定的标签
     * @param ele_id: 绑定标签的名称
     * @param ele_drop: 文件显示的位置
     * @param file_type: 文件类型
    */
    public BindLabelDrop(ele: HTMLElement, ele_id: string, ele_drop: HTMLElement) {
        let GCLC: ListenerCenter = new ListenerCenter();
        ele = this.CF.IdToElement(ele_id);
        GCLC.addEvent(EventDefinition.DROP, ele, this.DropCallBack.bind(this), ele_drop);
        GCLC.addEvent(EventDefinition.DROPOVER, ele, this.DragCallBack.bind(this), ele_drop);
    }

    /**拖放时的回调方法 */
    private DropCallBack(e, event) {
        let files: any[] = [];
        let show_ele: HTMLElement = e[1];
        this.startIndexEle.disabled = true;  //设置为不可编辑
        //this.Index = this.CurrentData.length;
        this.Index = parseInt(this.startIndexEle.value);
        console.log(this.Index)
        event.preventDefault();  //取消事件默认动作
        if (event.type == "drop") {
            files = event.dataTransfer.files;
            for (let inx = 0; inx < files.length; inx++) {
                //正则判断上传的文件是否为图片
                if (/image/.test(files[inx].type)) {
                    let reader: FileReader = new FileReader();
                    let file_data: FileData = new FileData();
                    let end:number = 0;
                    file_data.FileName = files[inx].name;
                    file_data.FileReader = reader;
                    file_data.ShowEle = show_ele;
                    reader.readAsDataURL(files[inx]);
                    this.CurrentData.push(file_data);
                    end = this.CurrentData.length - 1;  //从尾部取出上传数据，方便后续上传的图块信息不至于混乱
                    reader.onload = this.ShowCallBack.bind(this,this.CurrentData[end]);  //加载完成后回调
                }
            }
        }
    }

    /**拖放结束的回调方法 */
    private DragCallBack(e, event) {
        event.preventDefault();
    }

    /**显示回调处理 */
    private ShowCallBack(file_data:FileData) {
        let id_str:string = "";
        let img: HTMLImageElement = document.createElement("img");  //创建一个img元素
        let div: HTMLDivElement = document.createElement("div");
        if(file_data != null) {
            this.Index += 1;
            id_str = file_data.FileName.replace(/.png|.jpg/,"");  //剔除图片名称后缀方便做id
            //img.id = id_str;
            div.id = id_str;
            div.style.textAlign = "center";
            div.style.verticalAlign = "midden";
            img.src = file_data.FileReader.result + "";
            img.title = file_data.FileName;  //提示信息
            img.title += "@" + this.Index;  //将图块序号存入title
            div.style.margin = "4px";
            div.style.width = GlobalDefinition.BlockWidth + 8 + "px";
            div.style.height = GlobalDefinition.BlockHeight + 8 + "px";
            img.style.margin = "4px 2px";
            div.appendChild(img);
            file_data.ShowEle.appendChild(div);  //添加元素
        }
    }

}

/**文件数据对象 */
class FileData {
    public FileName:string = "";  //文件名称
    public FileReader: FileReader;  //读取的文件信息
    public ShowEle: HTMLElement;  //文件要显示对象
}